<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-touch-fullscreen" content="yes">
  <meta name="msapplication-tap-highlight" content="no">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <title>首页</title>
  <link rel="shortcut icon" href="/favicon.ico">
  <link rel="stylesheet" type="text/css" href="../../bootstrap-4.2.1/css/bootstrap.min.css">
  <link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm.min.css">
  <link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm-extend.min.css">
  <style type="text/css">
    	html,body{
  		height: 100%;
  		background-color: #ccc;
  	}
  	.container{
  		height: 100%;
  		padding: 0px; 
  		width: 571px;
  		display: flex;
  		flex-direction: column;
      background-color: #fff;
  	}
  	.header{
			height: 110px;
			width: 100%;
			background: #EAECEB;
  	}
  	.header-title{
  		height: 41%;
  		background: #DEE1E6;
  	}
  	.header-search{
  		height: 59%;
      padding: 10px;
  	}
  	.footer{
  		background: #ccc;
  		height: 64px;
  		flex: 0 0 auto;
  	}
  	.article{
  		height: 100%;
      padding: 3px;
      border: 1px solid #0f0;
      /*设置滚动条*/
      overflow-x: hidden;
      overflow-y: scroll;
      /*解决ios上滑动不流畅*/
      -webkit-overflow-scrolling: touch;
      /*纵向超出部分将会隐藏，即滚动条部分被挤出可视区域*/
    }
      /*设置滚动条，谷歌内核webkit*/
    .container ::-webkit-scrollbar {
        display: none;
    }
    /*设置滚动条，IE或者Firefox*/
    .container {
        -ms-overflow-style: none; /*IE 10+*/
        overflow: -moz-scrollbars-none; /*Firefox*/
    }
    a:link{
      text-decoration: none;
    }
    .bar{
      width: 571px;
      margin: auto;
    }
  </style>
</head>
<body>
	<div class="container">
		<!-- 头部，搜索，分类显示 -->
		<header class="header sticky-top">
			<!-- 分类 -->
			<div class="header-title">
				<div class="bar bar-nav">
			    <div class="buttons-row">
				    <a href="#" class="tab-link button active searchLoseBtn">寻找失物</a>
				    <a href="#" class="tab-link button searchLoserBtn">寻找失主</a>
				  </div>
				</div>	
			</div>
		  <!-- 搜索栏 -->
			<div class="header-search">
        <div class="searchbar row" style="border: 0px solid #0f0;padding-left: 60px;">
          <div class="search-input col-60">
            <label class="icon icon-search" for="search"></label>
            <input type="search" id='search' placeholder='输入关键字...'/>
          </div>
          <a class="button button-fill button-primary col-20">搜索</a>
        </div>
			</div>
		</header>
		<!-- 中间，记录显示 -->
		<article class="article" id="article" onscroll="myScrollToTopFn()">
      <!-- 寻找失物 -->
      <div id="searchLose" class="searchLose" style="border: 1px solid red;">
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/bg3.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <!-- <div href="#" class="text-center" style="border: 0px solid red;padding: 10px;">已经到底啦~~</div> -->
        <div class="article-end text-center" style="padding: 10px;">已经到底啦～</div>
      </div>
      <!-- 寻找失主 -->
      <div id="searchLoser" class="searchLoser" style="border: 1px solid red;display: none;">
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <section class="items" style="padding: 5px;border-bottom: 2px solid #ccc;">
          <a href="#" class="item" style="" onclick="console.log('click...')">
            <div class="itemDiv row" style="padding: 0px 2px 0px 22px;">
              <div class="item-img" style="width: 122px;height: 120px;">
                <img src="../../images/2.jpg" style="height: 100%;width: 100%;">
              </div>
              <div class="item-info col">
                <div class="item-info-top" style="color: #000;line-height: 40px;">
                  <span class="item-info-top-title">寻找女朋友寻找女朋友......</span>
                  <label class="item-info-top-category" style="float:right;font-size: 18px;font-weight: 600;color: #00B0AB;">男女朋友</label>
                </div>
                <div class="item-info-detail" style="padding: 5px 0px;color: #777;font-size: 19px;">
                  <span>没有女朋友，及寻找女朋友中......</span>
                </div>
                <div class="item-info-bottom text-right" style="color: #999999;font-size: 18px;padding: 4px 2px;">
                  <time>2019-02-25</time>
                </div>
              </div>
            </div>
          </a>
        </section>
        <!-- <div href="#" class="text-center" style="border: 0px solid red;padding: 10px;">已经到底啦~~</div> -->
        <div class="article-end text-center" style="padding: 10px;">已经到底啦～</div>
      </div>
    </article>
		<!-- 底部，导航栏 -->
		<footer class="footer">
		  <nav class="bar bar-tab">
		    <a class="tab-item active goToTopA" href="#">
		      <span class="icon icon-home goToTopIcon"></span>
		      <span class="tab-label goToTopInfo">首页</span>
		    </a>
		    <a class="tab-item" href="#">
		      <span class="icon icon-edit"></span>
		      <span class="tab-label">发贴</span>
		    </a>
		    <a class="tab-item" href="#">
		      <span class="icon icon-message"></span>
		      <span class="tab-label">信息</span>
		    </a>
		    <a class="tab-item" href="#">
		      <span class="icon icon-me"></span>
		      <span class="tab-label">我</span>
		    </a>
		  </nav>
		</footer>
	</div> <!-- end of container -->

  <script type='text/javascript' src='//g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script>
  <!-- <script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script> -->
  <script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm-extend.min.js' charset='utf-8'></script>
	<script type="text/javascript" src="../../js/jquery-3.3.1.min.js" charset="utf-8"></script>
	<script type="text/javascript" src="../../bootstrap-4.2.1/js/bootstrap.min.js"></script>
  <script src="../js/scrollToTop-master/jquery.scrollToTop.min.js"></script>
  <script type="text/javascript">
    // 获取滚动的元素
    var scrollArticle = document.getElementById("article")

    // 回到顶部函数
    function myScrollToTopFn() {
      // 获取滚动后的scrollTop值
      var articleScrollTop = scrollArticle.scrollTop 
      // 滚动一定距离后，显示回到顶部标识；否则复原
      if ( articleScrollTop > 600 ) {
        $('.goToTopIcon').removeClass('icon-home')
        $('.goToTopIcon').addClass('icon-up')
        $('.goToTopInfo').text('返回顶部')
        $('.goToTopA').on('click', function () {
          // 平滑的滚回到顶部
          scrollArticle.scrollTo({top:0,behavior:'smooth'})
        })
      } else {
        $('.goToTopIcon').removeClass('icon-up')
        $('.goToTopIcon').addClass('icon-home')
        $('.goToTopInfo').text('首页')
      }
    } // end of myScrollToTopFn()

    $(function(){
      // 显示寻找失主的div
      $('.searchLoserBtn').on('click', function () {
        $('.searchLoseBtn').removeClass('active')
        $(this).addClass('active')
        $('#searchLose').hide()
        $('#searchLoser').show()
        scrollArticle.scrollTop = 0
      })
      // 显示寻找失物主的div
      $('.searchLoseBtn').on('click', function () {
        $('.searchLoserBtn').removeClass('active')
        $(this).addClass('active')
        $('#searchLoser').hide()
        $('#searchLose').show()
        scrollArticle.scrollTop = 0
      })
    }) // end of $(function(){})
  </script>
</body>
</html>